/**
 * 用户注册图表显示
 * 
 * @return {}
 */
var userChartForm = function() {
	var userChartPanel = new Ext.form.FormPanel({
				id : 'userChartForm',
				frame : true,
				bodyBorder : false,
				anchor : '100% 10%',
				labelAlign : 'right',
				items : [{
					layout : 'column',
					border : false,
					items : [{
						columnWidth : .25,
						layout : 'form',
						border : false,
						items : [{
							xtype : "datefield",
							id : "userChartStartDate",
							name : "userChartStartDate",
							fieldLabel : "开始日期",
							format : "Y-m-d",// 日期的格式
							anchor : "100%",
							listeners : {
								'select' : function() {
									Ext.getCmp('userChart_checkBoxDay').reset();
									Ext.getCmp('userChartEndDate')
											.setMinValue(this.getValue());
								}
							}
						}]
					}, {
						columnWidth : .25,
						layout : 'form',
						border : false,
						items : [{
							id : "userChartEndDate",
							xtype : "datefield",
							name : "userChartEndDate",
							fieldLabel : "结束日期",
							anchor : "100%",
							format : "Y-m-d",// 日期的格式
							listeners : {
								'select' : function() {
									Ext.getCmp('userChart_checkBoxDay').reset();
									Ext.getCmp('userChartStartDate')
											.setMaxValue(this.getValue());
								}
							}
						}]

					}, {
						columnWidth : .25,
						layout : 'form',
						border : false,
						items : [{
							id : 'userChart_checkBoxDay',
							xtype : 'radiogroup',
							labelStyle : "text-align:right;",
							height : 20,
							name : 'radioBoxDay',
							fieldLabel : '天数',
							hideLabels : false,
							items : [{
										xtype : 'radio',
										boxLabel : '30天',
										name : 'radioDay',
										inputValue : 1
									}, {
										xtype : 'radio',
										boxLabel : '90天',
										name : 'radioDay',
										inputValue : 2
									}, {
										xtype : 'radio',
										boxLabel : '180天',
										name : 'radioDay',
										inputValue : 3
									}],
							listeners : {
								change : function(obj, newValue, oldValue,
										eOpts) {// 这事件是当radiogroup的值发生改变时进入
									console.info(newValue);
									if (newValue != null && newValue != ''
											&& newValue != 'null') {
										var userChartStartDate = Ext
												.getCmp('userChartStartDate')
												.setValue('');
										var userChartEndDate = Ext
												.getCmp('userChartEndDate')
												.setValue('');
										queryUserChart();
									}

								}
							}
						}]
					}, {
						columnWidth : .25,
						layout : 'form',
						border : false,
						items : [{
							layout : 'column',
							border : false,
							items : [{
										text : '查询',
										xtype : 'button',
										width : 80,
										handler : function() {
											queryUserChart();
										},
										style : {
											marginLeft : "100px",
											marginRight : "10px"
										}
									}, {
										text : '重置',
										xtype : 'button',
										width : 80,
										handler : function() {
											Ext.getCmp('userChartForm')
													.getForm().reset();
											// 对日期的初始设置
											Ext.getCmp('userChartStartDate')
													.setMaxValue(new Date());
											Ext.getCmp('userChartEndDate')
													.setMinValue("");
										}
									}]
						}]
					}]
				}]
			});
	return userChartPanel;
}
var userChartWin = function() {
	// 定义分析器
	var userChartReader = new Ext.data.JsonReader({
				fields : [{
							name : 'createUserDate'
						}, {
							name : "userNum"
						}]
			});
	var store = new Ext.data.JsonStore({
				fields : ['createUserDate', 'userNum'],
				autoLoad : true,// 要加载数据必须设置为true
				proxy : new Ext.data.HttpProxy({
							url : __ctxPath + "/userManager/selectUserChart",
							method : "post"
						}),
				remoteSort : false,
				reader : userChartReader
			});

	return new Ext.Panel({
				layout : "anchor",
				region : "center",
				height : document.body.clientHeight * 0.8,
				autoScroll : true,
				items : [{
							id : 'userChart_line',
							xtype : 'linechart',
							store : store,
							url : __ctxPath + '/ext/resources/charts.swf',
							xField : 'createUserDate',
							yAxis : new Ext.chart.NumericAxis({
										displayName : 'userNum'
									}),
							series : [{
										type : 'line',
										displayName : '注册人数',
										yField : 'userNum',
										style : {
											size : 7,
											color : 0x00BB00
										}
									}]
						}]
			});
}

// 查询
function queryUserChart() {
	var userChartStore = Ext.getCmp('userChart_line').store;
	var form = Ext.getCmp('userChartForm');
	userChartStore.baseParams = Ext.apply(userChartStore.baseParams, form
					.getForm().getValues());
	userChartStore.load();
}

Ext.getCmp("centerTabPanel").getActiveTab()
		.add(userChartForm(), userChartWin());
Ext.getCmp("centerTabPanel").getActiveTab().doLayout();